<template>
	<view class="search">
	<view class="city">
		<view class="citytip">
			<image src="../../static/img/s1.png" class="cityImg"></image>
			 <text class="citytxt">重点市区</text>
		</view>
		<view class="citylist">
			 <text class="citytxt color888" v-for="item in cityList"  @click="goCity(item)">{{item.name}}</text>
		</view>
	</view>
	<view class="scence">
		<view class="scencetip">
			<image src="../../static/img/s2.png" class="scenceImg"></image>
			 <text class="scencetxt">热门景区</text>
		</view>
		<view class="scencelist">
			 <text class="citytxt color888" v-for="item in scenceList" @click="goDetail(item)">{{item.name}}</text>
		</view>
	</view>
	<view class="hotel">
		<view class="hoteltip">
			<image src="../../static/img/s3.png" class="hotelImg"></image>
			 <text class="hoteltxt">热门酒店</text>
		</view>
		<view class="hotellist">
			 <text class="citytxt color888" v-for="item in hotelList" @click="goHotel(item)">{{item.name}}</text>
		</view>
	</view>
	</view>
</template>

<script>
		export default {
			data () {
				return {
					// title: ' 我的'
					cityList:[],
					scenceList:[],
					hotelList:[],
				}
			},
			onShow() {
				this.getData()
				this.getCity()
				this.getHotel()
			},
			methods: {
				//获取数据
				getData() {
					this.$postApi(this.$path.SEARCH_SOPT, {
						id: '',
						name: null,
						page: 1,
						rows: 10,
						cityAddress: null,
						type: 1
					}).then(data => {
						if (data.data.success) {
							console.log(data,'1111')
							this.scenceList = data.data.rows
						}
					})
				},
				//获取数据
				getCity() {
					this.$postApi(this.$path.GET_CITY_LIST, {
						parentId: "14000",
					}).then(data => {
						if (data.data.success) {
							console.log(data,'000')
							this.cityList = data.data.reListData;
						}
					})
				},
				//获取数据
				getHotel() {
					this.$postApi(this.$path.GET_HOTEL_LIST, {
						id: '',
						name: null,
						page: 1,
						rows: 10,
						hotelAddress: null,
						type: 1
					}).then(data => {
						if (data.data.success) {
							console.log(data,'33')
							for (let i = 0; i < data.data.rows.length; i++) {
								data.data.rows[i].hostImg = this.pub.fmtHttpUrl(data.data.rows[i].hostImg);
							}
							this.hotelList = data.data.rows;
						}
					})
				},
				goDetail(item) {
					uni.navigateTo({
						url: '/pages/scence/scencedetail?id=' + item.id,
						animationType: 'pop-in',
						animationDuration: 200
					});
				},
				goHotel(item) {
					let items = {
						id: item.id,
						// token: item.token
					}
					uni.navigateTo({
						url: '/pages/hotel/hoteldetail?item=' + encodeURIComponent(JSON.stringify(items)),
						animationType: 'pop-in',
						animationDuration: 200
					});
				},
				goCity(item) {
					let items = {
						id: item.id,
						name: item.name
					}
					uni.navigateTo({
						url: '/pages/scenicOrder/city?item=' + encodeURIComponent(JSON.stringify(items)),
						animationType: 'pop-in',
						animationDuration: 200
					});
				}
			}
		}
</script>

<style>
	.city,.scence,.hotel{
		padding: 20upx;

	}
	
	.cityImg,.scenceImg,.hotelImg{
		margin: 2upx 0 0 0;
		width: 40upx;
		height: 40upx;
	}
	.citytip,.scencetip,.hoteltip{
		display: flex;
		justify-content: flex-start;
		padding-bottom: 20upx;
		border-bottom: 1px solid #CCCCCC;
	}
	.citylist,.scencelist,.hotellist{
		padding: 40upx;
	}
	.citytxt,.scencetxt,.hoteltxt{
		margin-left: 40upx;
		display: inline-block;
		margin-bottom: 20upx;
	}
</style>
